<!DOCTYPE html >
<html xmlns:th="http://www.thymeleaf.org">

<head>
	<meta charset="utf-8">
	<meta name="viewport" content="width=device-width, initial-scale=1, shrink-to-fit=no">
	<title>结项</title>

	<link rel="stylesheet" type="text/css" href="/static/css/bootstrap.min.css">
	<link rel="stylesheet" type="text/css" href="/static/fonts/line-icons.css">
	<link href="/static/plugins/datatables/dataTables.bootstrap4.min.css" rel="stylesheet" type="text/css" />
	<link href="/static/plugins/datatables/buttons.bootstrap4.min.css" rel="stylesheet" type="text/css" />
	<link href="/static/plugins/datatables/responsive.bootstrap4.min.css" rel="stylesheet" type="text/css" />
	<link rel="stylesheet" type="text/css" href="/static/css/main.css">
	<link rel="stylesheet" type="text/css" href="/static/css/responsive.css">

</head>
<body>
	<div class="app header-default side-nav-dark">
		<div class="layout">
			<!--顶部栏-->
			<div th:replace="~{/topbar::topbar}">
			</div>
			<!--侧边栏-->
			<div th:replace="~{/sidebar::sidebar}">
			</div>
			<!--主体部分-->
			<div class="page-container">

				<div class="main-content">
					<div class="container-fluid">

						<div class="breadcrumb-wrapper row">
							<div class="col-12 col-lg-3 col-md-6">
								<h4 class="page-title">项目信息一览表</h4>
							</div>
							<!--
							<div class="col-12 col-lg-9 col-md-6">
								<ol class="breadcrumb float-right">
									<li><a href="#">Tables</a></li>
									<li class="active"> / Data Table</li>
								</ol>
							</div>
							-->
						</div>

					</div>
					<div class="container-fluid">
						<div class="row">
							<div class="col-md-12">
								<span class="badge badge-default">结项信息列表</span>
								<br>
								<br>
								<div class="text-right">
									<div class="btn-group" role="group">

										<!--<button class="btn btn-secondary" type="button">
                                            新增
                                        </button>-->
										<button type="button" class="btn btn-danger" data-toggle="modal" data-target="#addGrid">新增</button>
<!--										<a href="/project/cloQuery" >增加结项</a>-->
									</div>
								</div>
								<br>
								<br>
								<!--<table class="table">-->
								<table id="datatable" class="table table-bordered">
									<thead>
									<tr>
										<th>
											#
										</th>
										<th>
											项目结项批次名称
										</th>
										<th>
											开始时间
										</th>
										<th>
											结束时间
										</th>
										<th>
											批次状态
										</th>
										<th>
											结项材料
										</th>
										<th>
											操作
										</th>
									</tr>
									</thead>
									<tbody>
									<tr th:each="clo:${cloList}">
										<td th:text="${clo.getId()}" >
											1
										</td>
										<td th:text="${clo.name}">
											高校科研创新服务平台
										</td>
										<td th:text="${clo.starttime}">
											-07-07
										</td>
										<td th:text="${clo.starttime}">
											2021-11-20
										</td>
										<td th:text="${clo.state}">
											结项中
										</td>
										<td th:text="${clo.fileurl == null?'未提交':'已提交'}">
											结项中
										</td>
										<td >
											<!--<form id="fileForm" onsubmit="return f2()" method="post" enctype="multipart/form-data">-->
												<!--<input type="hidden" name="id" th:value="${clo.id}">-->
												<!--<input type="file" name="file" value="选择材料">-->
												<!--<div class="modal-footer px-4">-->
													<!--<button type="submit" class="btn btn-primary" >提交</button>-->
												<!--</div>-->
											<!--</form>-->
											<a th:href="@{'/project/getCloFile?id='+${clo.id}}">
												<button type="button" class="btn btn-secondary" >查看材料</button>
											</a>
											<a th:href="@{'/project/closure?id='+${clo.id}+'&&pid='+${clo.pid}}">
												<button type="button" class="btn btn-secondary"  >结束</button>
											</a>
										</td>
									</tr>
									</tbody>
								</table>
								<div class="modal fade" id="addGrid" tabindex="-1" role="dialog" aria-labelledby="Label" aria-hidden="true">
									<div class="modal-dialog" style="width:420px;" role="document">
										<div class="modal-content">
											<div class="modal-header px-4">
												<h5 class="modal-title" id="Label">Add Somthing to Grid</h5>
												<button type="button" class="close" data-dismiss="modal" aria-label="Close">
													<span class="material-icons ">close</span>
												</button>
											</div>
											<div class="modal-body p-4">

												<form id="cloForm" onsubmit="return f()" method="post">
													<div class="form-group">
														<label for="project">选择要结项的项目</label>
														<select name="pid" id="project">
															<option th:each="project:${projectList}" th:value="${project.getId()}"
																	th:text="${project.name}"></option>
														</select>
													</div>
													<div class="form-group">
														<label for="Input2">项目结项批次名称</label>
														<input type="text" class="form-control" id="Input2" name="name">
													</div>
													<div class="form-group">
														<label for="Input3">开始时间</label>
														<input type="date" class="form-control" id="Input3" name="startTime">
													</div>
													<div class="form-group">
														<label for="Input4">结束时间</label>
														<input type="date" class="form-control" id="Input4" name="endTime">
													</div>
													<div class="modal-footer px-4">
														<button type="button" class="btn btn-secondary" data-dismiss="modal">Close</button>
														<button type="submit" class="btn btn-primary" >新增项目</button>
													</div>
												</form>

											</div>

										</div>
									</div>
								</div>
							</div>
						</div>
					</div>


					<footer class="content-footer">
						<div th:replace="~{/footer::footer}"></div>
					</footer>

				</div>

			</div>
		</div>
	</div>
	<script src="/static/js/jquery-min.js"></script>
	<script src="/static/js/popper.min.js"></script>
	<script src="/static/js/bootstrap.min.js"></script>
	<script src="/static/js/scripts.js"></script>
	<script src="/static/js/jquery.app.js"></script>
	<script src="/static/js/main.js"></script>

	<script src="/static/plugins/datatables/jquery.dataTables.min.js"></script>
	<script src="/static/plugins/datatables/dataTables.bootstrap4.min.js"></script>

	<script src="/static/plugins/datatables/dataTables.buttons.min.js"></script>
	<script src="/static/plugins/datatables/buttons.bootstrap4.min.js"></script>
	<script src="/static/plugins/datatables/jszip.min.js"></script>
	<script src="/static/plugins/datatables/pdfmake.min.js"></script>
	<script src="/static/plugins/datatables/vfs_fonts.js"></script>
	<script src="/static/plugins/datatables/buttons.html5.min.js"></script>
	<script src="/static/plugins/datatables/buttons.print.min.js"></script>
	<script src="/static/plugins/datatables/buttons.colVis.min.js"></script>

	<script src="/static/plugins/datatables/dataTables.responsive.min.js"></script>
	<script src="/static/plugins/datatables/responsive.bootstrap4.min.js"></script>

	<script src="/static/js/datatables.init.js"></script>
	
	<script type="text/javascript">
        function f() {
            var formData = new FormData($('#cloForm')[0]);
            $.ajax({
                url:"/project/addClosure",
                type:"post",
                data:formData,
                processData:false,
                contentType:false,
                success:function (result) {
                    if (result && result.success) {
                        alert("提交成功");
                        window.location.href = "/project/closure";
                    } else {
                        alert(result.msg);
                    }
                }
            });
            return false;
        }

        function f2() {
            var formData = new FormData($('#fileForm')[0]);
            $.ajax({
                url:"/project/cloFile",
                type:"post",
                data:formData,
                processData:false,
                contentType:false,
                success:function (result) {
                    if (result && result.success) {
                        alert("提交成功");
                        window.location.href = "/project/cloQuery";
                    } else {
                        alert(result.msg);
                    }
                }
            });
            return false;
        }
	</script>
	</body>
	</html>